import {View,Text,StyleSheet,Image,TouchableOpacity,TextInput} from 'react-native';
import React from 'react';
import './global';


const Modify=()=>{

    return(
        <View style={{backgroundColor:'#F5F5F5'}}>
            <View style={styles.header}>
                <Text style={styles.keep}>保存</Text>
            </View>
            <View style={styles.top}>
                <Image
                    source={require('../assets/img.png')}
                    style={styles.person}
                />
                <Text style={styles.change}>点击修改头像</Text>

            </View>
            <View style={styles.box}>

                <View style={styles.id}>
                    <Text style={styles.font}>用户ID</Text>
                    <TextInput style={styles.idcontext}>123123123</TextInput>
                    <TouchableOpacity style={styles.copy}>
                        <Text style={styles.copycontext}  >复制</Text>
                    </TouchableOpacity>
                </View>

                <View style={styles.name}>
                    <Text style={styles.font}>昵称</Text>
                    <TextInput style={styles.namecontext}>lalala</TextInput>
                </View>

                <View style={styles.sex}>
                    <Text style={styles.font}>性别</Text>
                    <TextInput style={styles.sexcontext} >女</TextInput>
                </View>

                <View style={styles.birthday}>
                    <Text style={styles.font}>出生日期</Text>
                    <TextInput style={styles.sexcontext}>2000-1-1</TextInput>
                </View>

            </View>
            <View style={styles.line}>
                <Text style={styles.linefont}>个性标签：</Text>
                <TextInput style={styles.commentary}
                    blurOnSubmit={false}
                    multiline={true}
                >这个人很懒什么都没有留下。</TextInput>
            </View>
        </View>
    )
}
const styles = StyleSheet.create({
    header:{
        height:p2d(120),
        backgroundColor:'lightblue'
    },
    top:{
        width:'100%',
        height:p2d(400),
    },
    box:{
        backgroundColor:'white',
        height:p2d(500),
        width:'90%',
        left:'5%',
        top:p2d(30),
        borderRadius:p2d(30),
    },
    line:{
        width:'90%',
        height:p2d(200),
        top:p2d(60),
        left:'5%',
        backgroundColor:'white',
        borderRadius:p2d(20),
        borderWidth:p2d(2),
    },
    person:{
        height:p2d(250),
        width:p2d(250),
        borderRadius:p2d(125),
        left:'32%',
        bottom:p2d(100),
        position:'absolute',
    },
    change:{
        fontSize:p2d(30),
        color:'#A9A9A9',
        position:'absolute',
        left:'36%',
        bottom:p2d(50),
    },
    id:{height:p2d(125),
        borderBottomWidth:p2d(10),
        borderBottomColor:'#F5F5F5',
    },
    name:{height:p2d(125),
        borderBottomWidth:p2d(10),
        borderBottomColor:'#F5F5F5',
    },
    sex:{height:p2d(125),
        borderBottomWidth:p2d(10),
        borderBottomColor:'#F5F5F5',
    },
    birthday:{height:p2d(125),

    },
    keep:{
        position:'absolute',
        fontSize:p2d(30),
        right:p2d(20),
        bottom:p2d(20),
    },
    font:{
        position:'absolute',
        fontSize:p2d(30),
        lineHeight:p2d(125),
        left:p2d(20),

    },
    idcontext:{
        width:'80%',
        position:'absolute',
        textAlign:'center',
        fontSize:p2d(25),
        color:'#151515',
        height:p2d(30),
        top:p2d(50),
    },
    namecontext:{
        width:'80%',
        position:'absolute',
        textAlign:'center',
        fontSize:p2d(25),
        color:'#585858',
        height:p2d(30),
        top:p2d(50),
    },
    copy:{
        position:'absolute',
        right:p2d(200),
        top:p2d(45),
        height:p2d(40),
        width:p2d(60),
        borderWidth:p2d(2),
        borderRadius:p2d(10)
    },  
    copycontext:{
        lineHeight:p2d(35),
        position:'absolute',
        fontSize:p2d(25),
        color:'#6E6E6E',
        textAlign:'center',
        left:p2d(3),
    },
    sexcontext:{
        top:p2d(45),
        position:'absolute',
        fontSize:p2d(25),
        color:'black',
        left:p2d(250),
    },
    linefont:{
        fontSize:p2d(30),
        lineHeight:p2d(40),
        left:p2d(20),
    },
    commentary:{
        left:p2d(20),
        fontSize:p2d(20),
        width:p2d(600),
    }

})
export default Modify;